<div class="weui-tab__panel"><ng-content></ng-content></div>
<div class="weui-tabbar">
  <div class="weui-tabbar__item" *ngFor="let item of tabs" [ngClass]="{ 'weui-bar__item_on': item.active }" (click)="setActive(item)">
    <div style="position: relative; display: inline-block;">
      <div *ngIf="item.iconUrl" class="weui-tabbar__icon" [ngClass]="item.iconClassName">
        <img [src]="item.active ? item.activeIcon : item.icon" />
      </div>
      <div *ngIf="!item.iconUrl" class="weui-tabbar__icon" [innerHTML]="item.active ? item.activeIcon : item.icon" [ngClass]="item.iconClassName"></div>
      <span class="weui-badge" style="position: absolute; top: -2px; right: -13px;" *ngIf="item.badge && item.badge !== 'dot'">{{ item.badge }}</span>
      <span class="weui-badge weui-badge_dot" style="position: absolute; top: 0; right: -6px;" *ngIf="item.badge && item.badge === 'dot'"></span>
    </div>
    <p class="weui-tabbar__label">{{ item.heading }}</p>
  </div>
</div>
